<template>
     <div ref="wrapper">
         <slot></slot>
     </div>
</template>
<script>
    import BScroll from 'better-scroll'
    export default{
        props:{
            probeType:{
                type:Number,
                default:1
            },
            click: {
                type: Boolean,
                default: true
            },
            data: {
                type: Array,
                default: null
            },
            ListenScroll: {
                type: Boolean,
                default: false
            },
            beforeScroll: {
                type: Boolean,
                default: false
            },
            pullup: {
                type: Boolean,
                default: false
            },
            // 将等待刷新时间设为变量，灵活控制，防止和其它动画时间冲突
            refreshDelay:{
                type:Number,
                default:20
            }
        },
          mounted(){
              setTimeout(() => {
                  this._initScroll()
              }, 20)
          },
        methods:{
            _initScroll(){
                if (!this.$refs.wrapper) {
                    return
                }
                this.scroll = new BScroll(this.$refs.wrapper, {
                    probeType: this.probeType,
                    click: this.click
                })
                if (this.ListenScroll) {
                    let me = this
                    this.scroll.on('scroll',(pos) => {
                        me.$emit('scroll',pos)
                    })
                }
                // pullup为true触发上拉加载能力
                if (this.pullup) {
                    this.scroll.on('scrollEnd', () => {
                        // 如果快滚动到底部时，派发一个事件
                        if (this.scroll.y <= this.scroll.maxScrollY + 50) {
                            this.$emit('scrollToEnd')
                        }
                    })
                }
                // 如果开始滚动，派发事件
                if (this.beforeScroll) {
                    this.scroll.on('beforeScrollStart',() => {
                        this.$emit('beforeScroll')
                    })
                }
            },
            disable() {
                this.scroll && this.scroll.disable()
            },
            enable() {
                this.scroll && this.scroll.enable()
            },
            refresh() {
                this.scroll && this.scroll.refresh()
            },
            scrollTo(){
                this.scroll && this.scroll.scrollTo.apply(this.scroll,arguments)
            },
            scrollToElement(){
                this.scroll && this.scroll.scrollToElement.apply(this.scroll,arguments)
            }
          }

    }
</script>